<template>
  <div id="order-root">
    <div class="order">
      <center class="logo-box" v-if="fromOne"></center>
      <canvas class="canvas" v-show="false"></canvas>
      <canvas id="canvas" v-show="false"></canvas>
      <img class="subscriptio" :src="subscriptioImg" id="QRCODE" />
      <img class="subscriptio" :src="subscriptioImg1" id="QRCODE1" />

      <div class="center">
        <div class="centerLine"></div>

        <div class="tableTitle">
          <span class="midText">
            <h2 class="center-title">专利信息</h2>
          </span>
        </div>
        <div class="clearfix">
          <h3 class="h4 applyNo1">
            申报主体
            <span class="required-tag">*</span>
          </h3>
          <el-cascader
            :options="options"
            v-model="option1"
            @visible-change="visibleChange"
            class="patentInfo_select input-left applyNo40Box"
          >
            <template slot-scope="{ node, data }">
              <span
                style="display: inline-block;width: 100%;height: 100%;"
                @click="onToggleClssName(data)"
              >{{ data.label }}</span>
            </template>
          </el-cascader>
          <ul class="Explanation-right">
            <li>
              <span class="span2">1. idea模式：</span>
              <span class="span4">发明人有想法，并没有成熟的技术方案或设计方案，配图可有可无。</span>
            </li>
            <li>
              <span class="span2">2. 技术交底模式：</span>
              <span class="span4">需提供详细技术方案，发明人应对技术方案的内容负责，应该尽量提供清晰明了的配图。</span>
            </li>
            <li>
              <span class="span2">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2.1. 在线填写：</span>
              <span class="span4">根据表单信息填写提交。</span>
            </li>
            <li>
              <span class="span2">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2.2. 上传文件：</span>
              <span class="span4">无需填写表单，上传文件即可。</span>
            </li>
            <li>
              <span class="span2">3. 定向导航：</span>
              <span class="span4">发明人需要有一定的研究基础，包括已申报专利列表，或项目申请书等定向材料。</span>
            </li>
            <!-- <li><span class="span2">4- 商标注册</span></li> -->
            <li>
              <span class="span2">4. 软件著作权：</span>保护开发者权益，避免代码被盗版或者侵权。
            </li>
            <li>
              <span class="span2">5. 申诉案件：</span>申诉案件。
            </li>
            <li>
              <span class="span2">6. 答复案件：</span>答复案件。
            </li>
          </ul>
        </div>
        <div v-if="currentType == 5 || currentType == 6">
          <div class="tableTitle">
            <span class="midText">
              <h3 class="center-title">案件信息</h3>
            </span>
          </div>
          <div class="clearfix">
            <h3 class="h4 applyNo15">
              申请号
              <span class="required-tag">*</span>
            </h3>
            <el-input
              class="field applyNo15Box input-left"
              placeholder="请输入内容"
              v-model="application_number"
            ></el-input>
            <span class="span4 Explanation-right linehighlight40">请填写案件正确的申请号</span>
          </div>
          <h3 class="h4 applyNo1">
            订单类型
            <span class="required-tag">*</span>
          </h3>
          <el-cascader
            :options="orderType"
            v-model="orderOption"
            @visible-change="visibleChange"
            class="patentInfo_select input-left applyNo40Box"
          >
            <template slot-scope="{ node, data }">
              <span
                style="display: inline-block;width: 100%;height: 100%;"
                @click="orderTypeName(data)"
              >{{ data.label }}</span>
            </template>
          </el-cascader>
          <ul class="Explanation-right">
            <li>
              <span class="span2">订单类型：</span>
              <span class="span4">选择需要申述的订单类型。</span>
            </li>
            <li>
              <span class="span2">1,</span>
              <span class="span4">发明专利。</span>
            </li>
            <li>
              <span class="span2">2,</span>
              <span class="span4">实用新型。</span>
            </li>
            <li>
              <span class="span2">3,</span>
              <span class="span4">外观设计。</span>
            </li>
          </ul>
          <div class="clearfix">
            <h3 class="h4 applyNo15">
              审查意见
              <span class="required-tag">*</span>
            </h3>
            <el-upload
              class="input-left applyNo99Box"
              ref="upload"
              :action="uploadFileUrl"
              accept=".zip,application/pdf"
              :before-upload="beforeCheckUpload"
              :on-success="successUpload"
              :file-list="checkFileList"
            > 
              <el-button slot="trigger" size="small" type="primary">上传文件</el-button>
              <div slot="tip" class="el-upload__tip">只能上传单个PDF文件或zip压缩文件，且不超过10M</div>
            </el-upload>
            <span class="span4 Explanation-right lh18">
              1.审查意见通知书是PDF文件
              <br />2.审查意见可以为多文件，当多文件时需上传压缩包文件。
            </span>
          </div>
          <div class="clearfix" v-if="currentType == 5">
            <h3 class="h4 applyNo99">
              驳回通知书
              <span class="required-tag">*</span>
            </h3>
            <el-upload
              class="input-left applyNo99Box"
              ref="upload"
              :action="uploadFileUrl"
              accept=".docx,.doc"
              :before-upload="beforeFileCheckUpload"
              :on-success="successFileUpload"
              :file-list="rejectFile	"
            > 
              <el-button slot="trigger" size="small" type="primary">上传文件</el-button>
              <div slot="tip" class="el-upload__tip">只能上传docx和doc文件，且不超过10M</div>
            </el-upload>
            <span class="span4 Explanation-right lh18">
              1.申诉案件必传驳回通知书
              <a
                :href="baseUrl + '/storage/upload/softWork/软件著作权登记说明书样板.doc'"
                :download="baseUrl + '/storage/upload/softWork/软件著作权登记说明书样板.doc'"
                title="软件著作权登记说明书样板.doc"
                class="el-icon-tickets file_sh"
              ></a> 
            </span>
          </div>
          <div class="clearfix">
            <h3 class="h4 applyNo99">
              申请文件
              <span class="required-tag">*</span>
            </h3>
            <el-upload
              class="input-left applyNo99Box"
              ref="upload"
              :limit="1"
              :action="uploadFileUrl"
              accept=".zip,.rar"
              :before-upload="beforeAppealUpload"
              :on-success="successUpload2"
              :file-list="appealFileList"
            > 
              <el-button slot="trigger" size="small" type="primary">上传文件</el-button>
              <div slot="tip" class="el-upload__tip">只能上传zip和rar压缩文件，且不超过10M</div>
            </el-upload>
            <span class="span4 Explanation-right lh18">
              1.申请文件只能上传压缩包
            </span>
          </div>
          <div class="clearfix">
            <h3 class="h4 applyNo11">
              专利权人
              <span class="required-tag">*</span>
            </h3>
            <el-autocomplete
              class="field applyNo11Box input-left"
              v-model="patentedPerson"
              :fetch-suggestions="querySearch1"
              :trigger-on-focus="false"
              placeholder="请输入专利权人"
              :validate-event="false"
            ></el-autocomplete>

            <ul class="ul Explanation-right">
              <li>
                <span class="span4">1. 专利权人如果为单位，请填写单位名称，如XXXXXX公司，XXXXXXX学校等</span>
              </li>
              <li>
                <span class="span4">2. 如果专利权人为个人，请填写个人姓名，如张三</span>
              </li>
              <li>
                <span
                  class="span2"
                >3. 若专利权人为个人，办理专利费用减缴备案后即可享受相应比例的专利费用减缴，备案资料：上一年度年收入低于6万元的收入证明以及个人身份证明文件</span>
              </li>
            </ul>
          </div>
          <div class="tableTitle">
            <span class="midText">
              <h3 class="center-title">联络人信息</h3>
            </span>
          </div>

          <div class="clearfix">
            <h3 class="h4 applyNo14">
              联络人
              <span class="required-tag">*</span>
            </h3>
            <el-input
              class="field applyNo14Box input-left"
              placeholder="请输入内容"
              v-model="contacts"
            ></el-input>
            <span class="span4 Explanation-right linehighlight40">请填写联络人姓名</span>
          </div>
          <div class="clearfix">
            <h3 class="h4 applyNo15">
              联络人电话
              <span class="required-tag">*</span>
            </h3>
            <el-input
              class="field applyNo15Box input-left"
              placeholder="请输入内容"
              @blur="changePhone"
              v-model="contactsPhone"
            ></el-input>
            <span class="span4 Explanation-right linehighlight40">请填写正确的手机号码</span>
          </div>
          <div class="clearfix">
            <h3 class="h4 applyNo16">
              联络人邮箱
              <span class="required-tag">*</span>
            </h3>
            <el-input class="field applyNo16Box input-left" placeholder="请输入内容" v-model="email"></el-input>
            <span
              class="span2 Explanation-right linehighlight40"
            >#注意：邮箱务必可用，除电话沟通外，代理人可能选择邮箱跟您确认相关内容#</span>
          </div>
        </div>
        <div v-else>
          <div v-if="option1[0]=='5'">
            <h4 class="h4 applyNo25">
              软件全称
              <span class="required-tag">*</span>
            </h4>
            <el-input class="field applyNo25Box" placeholder="请输入内容" v-model="option5Val1"></el-input>
            <h4 class="h4 applyNo26">
              软件简介
              <span class="required-tag">*</span>
            </h4>
            <el-input class="field applyNo26Box" placeholder="请输入内容" v-model="option5Val2"></el-input>
            <h4 class="h4 applyNo27">
              分类号
              <span class="required-tag">*</span>
            </h4>
            <el-input class="field applyNo27Box" placeholder="请输入内容" v-model="option5Val3"></el-input>
            <h4 class="h4 applyNo28">
              版本号
              <span class="required-tag">*</span>
            </h4>
            <el-input class="field applyNo28Box" placeholder="例: V1.0/1.0" v-model="option5Val4"></el-input>
            <h4 class="h4 applyNo29">软件作品说明</h4>
            <p>原创</p>
            <h4 class="h4 applyNo30">
              开发完成日期
              <span class="required-tag">*</span>
            </h4>
            <el-date-picker
              class="field applyNo30Box"
              v-model="option5Val5"
              type="date"
              placeholder="选择日期"
            ></el-date-picker>
            <h4 class="h4 applyNo31">
              发表状态
              <span class="required-tag">*</span>
            </h4>
            <el-radio-group v-model="option5Val6" class="applyNo31Box">
              <el-radio label="1">已发表</el-radio>
              <el-radio label="2">未发表</el-radio>
            </el-radio-group>
            <br />
            <br />
            <span class="span4 applyNo32">首次发表日期</span>
            <br />
            <el-date-picker
              class="field applyNo32Box"
              v-model="option5Val7"
              type="date"
              placeholder="选择日期"
            ></el-date-picker>
            <br />
            <br />
            <span class="span4 applyNo33">首次发表地点</span>
            <br />
            <el-select class="applyNo33Box" placeholder="请选择国家" filterable v-model="option5Val8">
              <el-option-group v-for="group in country" :key="group.label" :label="group.label">
                <el-option
                  v-for="item in group.options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.label"
                >
                  <span style="float: left">{{ item.label }}</span>
                  <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
                </el-option>
              </el-option-group>
            </el-select>
            <el-input class="field applyNo34Box" placeholder="请输入城市" v-model="option5Val9"></el-input>
            <h4 class="h4 applyNo35">开发方式</h4>
            <p>独立开发</p>
            <h4 class="h4 applyNo36">权利取得方式</h4>
            <p>原始取得</p>
            <h4 class="h4 applyNo37">
              硬件环境
              <span class="required-tag">*</span>
            </h4>
            <el-input
              class="field applyNo37Box"
              v-model="option5Val10"
              placeholder="指开发和运行该软件的计算机硬件和专用设备。如:“CPU PⅢ，800/内存，128M，硬盘20G以上”"
              type="textarea"
              :autosize="{ minRows: 4, maxRows: 4}"
            ></el-input>
            <h4 class="h4 applyNo38">
              软件环境
              <span class="required-tag">*</span>
            </h4>
            <el-input
              class="field applyNo38Box"
              v-model="option5Val11"
              placeholder="指开发和运行该软件的操作系统、支持软件的名称及其版本号。如“WINDOWS 2000/XP/2003”等等。安卓与IOS分开申请"
              type="textarea"
              :autosize="{ minRows: 4, maxRows: 4}"
            ></el-input>
            <h4 class="h4 applyNo39">
              编程语言
              <span class="required-tag">*</span>
            </h4>
            <el-input
              class="field applyNo39Box"
              v-model="option5Val12"
              placeholder="指编写该软件的编程工具。如“Java 1.4.3”:VC 6.0，VB 6.0"
              type="textarea"
              :autosize="{ minRows: 4, maxRows: 4}"
            ></el-input>
            <h4 class="h4 applyNo40">
              源程序量
              <span class="required-tag">*</span>
            </h4>
            <el-input
              class="field applyNo40Box"
              placeholder="（只能填写数字）指本软件源程序的总行数或总条数，如“10000”。"
              v-model="option5Val13"
            ></el-input>
            <h4 class="h4 applyNo41">
              主要功能和技术特点
              <span class="required-tag">*</span>
            </h4>
            <el-input
              class="field applyNo41Box"
              v-model="option5Val14"
              placeholder="主要阐述软件的创作目的、主要功能、用途和技术特点，必须有软件主要功能模块的描述。注意，本栏目中如果出现软件名称，要与申请表中的软件名称一致。不能侵犯他人在先权利。限定350汉字"
              type="textarea"
              :autosize="{ minRows: 4, maxRows: 4}"
              :maxlength="350"
            ></el-input>
            <h4 class="h4 applyNo42">
              类别
              <span class="required-tag">*</span>
            </h4>
            <el-select v-model="option5Val15" placeholder="请选择" class="field applyNo42Box">
              <el-option
                v-for="item in option5Arr"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
            <h4 class="h4 applyNo43">
              名称
              <span class="required-tag">*</span>
            </h4>
            <el-input
              class="field applyNo43Box"
              placeholder="姓名或名称应与身份证明文件一致"
              v-model="option5Val16"
            ></el-input>
            <h4 class="h4 applyNo44">
              证件类型
              <span class="required-tag">*</span>
            </h4>
            <el-select v-model="option5Val17" placeholder="请选择" class="field applyNo44Box">
              <el-option
                v-for="item in option6Arr"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </div>
          <div v-if="option1[0] == '1'  || option1[1] == 'a'">
            <div v-if="!isHiddenTextarea">
              <div class="clearfix">
                <h3 class="h4 applyNo3">
                  技术领域
                  <span class="required-tag">*</span>
                </h3>
                <!-- <el-input :clearable="true"></el-input> -->
                <el-select
                  class="field input-left applyNo3Box"
                  filterable
                  v-model="field"
                  placeholder="请选择所属领域"
                >
                  <el-option
                    v-for="item in fields"
                    :key="item.id"
                    :value="item.label"
                    :label="item.label"
                  ></el-option>
                </el-select>
                <span class="span4 Explanation-right linehighlight40">直接所属或直接应用的领域</span>
              </div>

              <div class="clearfix">
                <h3 class="h4 applyNo4">
                  技术背景
                  <span class="required-tag">*</span>
                </h3>
                <el-input
                  class="field applyNo4Box input-left"
                  type="textarea"
                  placeholder="请输入内容"
                  v-model="textarea"
                  :autosize="{ minRows: 4, maxRows: 4}"
                ></el-input>
                <span
                  class="span4 Explanation-right"
                >最接近的同类现有技术是什么样的，存在哪些缺点或不足之处， 最好以文献检索为依据并提供介绍该技术的内容，以及相关专利的申请号</span>
              </div>
            </div>
            <div class="clearfix">
              <h3 class="h4 applyNo5">
                技术问题
                <span class="required-tag">*</span>
              </h3>
              <el-input
                class="field applyNo5Box input-left"
                type="textarea"
                placeholder="请输入内容"
                v-model="textarea2"
                :autosize="{ minRows: 4, maxRows: 4}"
              ></el-input>
              <span
                class="span4 Explanation-right"
              >本项目要解决的技术问题，可以是生活中、工作中遇到的困难，或者不方便的地方，技术问题就是要处理的问题或者要解决的困难</span>
            </div>

            <div class="clearfix">
              <h3 class="h4 applyNo6">
                技术方案
                <span class="required-tag">*</span>
              </h3>
              <el-input
                class="field applyNo6Box input-left"
                type="textarea"
                placeholder="请输入内容"
                v-model="textarea3"
                :autosize="{ minRows: 4, maxRows: 4}"
              ></el-input>
              <ul class="ul Explanation-right">
                <li>
                  <span class="span2">1. idea模式：</span>
                  <span class="span4">提出想法即可，无需具体方案；</span>
                </li>
                <li>
                  <span class="span2">2. 技术交底模式：</span>
                  <span class="span4">
                    要清楚、完整、准确地详细加以描述，特别是要把区
                    别于现有技术的发明点尽可能地描述清楚，以使本领域内的普通技术人员能实施为准，并且在描述技术方案的 每项技术手段时，相应地说明其在本发明中所起的作用。发明点的替代技术方案如果有，也要尽量提出。包括
                    上述技术方案为什么能够解决上述技术问题（推理、分析）；
                  </span>
                </li>
                <li>
                  <span class="span2">3. 定向导航：</span>
                  <span class="span4">发明人需提供该研究方向的基础专利列表或项目实施内容等。</span>
                </li>
              </ul>
            </div>

            <div class="clearfix">
              <h3 class="h4 applyNo7">
                项目优势
                <span class="required-tag">*</span>
              </h3>
              <el-input
                class="field applyNo7Box input-left"
                type="textarea"
                placeholder="请输入内容"
                v-model="textarea4"
                :autosize="{ minRows: 4, maxRows: 4}"
              ></el-input>
              <span
                class="span4 Explanation-right"
              >本项目所能达到的效果（包括社会的、经济的、技术的效果，最好有具体数据）具体地、实事求是地进行描述。</span>
            </div>

            <div v-if="option1[1] == 'a'">
              <div class="clearfix">
                <h3 class="h4 applyNo8">
                  具体实施方式
                  <span class="required-tag">*</span>
                </h3>
                <el-input
                  class="field applyNo8Box input-left"
                  type="textarea"
                  placeholder="请输入内容"
                  v-model="textarea5"
                  :autosize="{ minRows: 4, maxRows: 4}"
                ></el-input>
                <span class="span4 Explanation-right">
                  应说的详细、具体，能按此再现本技术，如原料的产地、名称、操作程序、组成、配方、用途、 效果、参数、条件、手段等都应尽可能的说明清楚。属于方法的发明，应首先说明为达到发明目的而必须实施
                  的方式或操作方法，还应指出该方法必要的各种参数、装置和材料。属于物质的发明在具体实例中，应列举该 物质结构式或组成的成份，物性和比例，并应有试验报告。对于涉及较宽的数值范围时，应给出两端的实施例
                  和至少一个中间值的实施例加以说明。
                </span>
              </div>
            </div>
          </div>
          <div v-if="option1[0] != '4'">
            <div class="clearfix">
              <h3 class="h4">
                附图
                <span v-if="option1[1] == 'b' ||  option1[0] == '3' " class="required-tag">*</span>
              </h3>
              <el-upload
                class="upload-demo applyNo1Box input-left"
                ref="upload"
                :action="uploadImgUrl"
                :on-preview="handlePreview"
                :on-remove="handleRemove"
                :on-success="handleSuccess"
                :file-list="fileList"
                :auto-upload="true"
                :before-upload="beforeUpload"
                multiple
              >
                <el-button v-no-more-click:3000 slot="trigger" type="primary">上传图片</el-button>
                <div slot="tip" class="el-upload__tip">只能上传 jpg/jpeg/png/gif 文件，且不超过10M</div>
              </el-upload>
              <ul class="ul Explanation-right">
                <li>
                  <span class="span2">1. idea模式：</span>
                  <span class="span4">可以不用上传图片（选填）；</span>
                </li>
                <li>
                  <span class="span2">2. 技术交底模式：</span>
                  <span class="span4">强烈建议上传配图；</span>
                </li>
                <li>
                  <span class="span2">3. 定向导航：</span>
                  <span class="span4">强烈建议上传配图；</span>
                </li>
              </ul>
            </div>

            <div v-if="option1[0] != '1' && option1[1] != 'a' && option1[0] != '4'">
              <div class="clearfix">
                <h3 class="h4">
                  附件
                  <span v-if="option1[1] == 'b'  ||  option1[0] == '3'" class="required-tag">*</span>
                </h3>
                <el-upload
                  class="upload-demo input-left"
                  ref="upload2"
                  :action="uploadFileUrl"
                  :on-preview="handlePreview2"
                  :on-remove="handleRemove2"
                  :on-success="handleSuccess2"
                  :file-list="fileList2"
                  :auto-upload="true"
                  :before-upload="beforeUpload2"
                  multiple
                >
                  <el-button slot="trigger" type="primary">上传文件</el-button>
                  <div slot="tip" class="el-upload__tip">只能上传.doc或.docx 文件，且不超过100M</div>
                </el-upload>
                <span class="span4 Explanation-right linehighlight40">定向导航类 项目需要上传项目书或基础专利文件</span>
              </div>
            </div>
          </div>
          <div v-if="option1[0] == '4'">
            <div>
              <div class="clearfix">
                <h3 class="h4 applyNo99">
                  说明书文件
                  <span class="required-tag">*</span>
                </h3>
                <upload-file
                  :limit="1"
                  class="input-left applyNo99Box"
                  ref="explain-file"
                  btnSize="middle"
                  fileLimit="docx"
                  @upChange="explainChange"
                  v-if="show_file"
                  btnText="上传文件"
                ></upload-file>
                <span class="span4 Explanation-right lh18">
                  1.软件著作权登记说明书样板：
                  <a
                    :href="baseUrl + '/storage/upload/softWork/软件著作权登记说明书样板.doc'"
                    :download="baseUrl + '/storage/upload/softWork/软件著作权登记说明书样板.doc'"
                    title="软件著作权登记说明书样板.doc"
                    class="el-icon-tickets file_sh"
                  ></a>
                  <br />2.需要图文并茂，
                  <span class="span2">7页以上</span>
                  <br />3.如果是手机软件截图需包含信号栏
                  <br />4.无界面软件需要有
                  <span class="span2">流程图</span>
                  <br />5.IOS和安卓系统请
                  <span class="span2">分别登记</span>，截图部分需与各自系统对应
                </span>
              </div>
            </div>
            <div v-if="option1[1] == 1">
              <div class="clearfix">
                <h3 class="h4 applyNo98">
                  源码文件
                  <span class="required-tag">*</span>
                </h3>
                <upload-file
                  :limit="1"
                  v-if="show_file"
                  class="input-left applyNo98Box"
                  ref="code-file"
                  btnSize="middle"
                  fileLimit="docx"
                  @upChange="codeChange"
                  btnText="上传文件"
                ></upload-file>
                <span class="span4 Explanation-right lh18">
                  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;一般交存，即提交源程序的
                  <span
                    class="span2"
                  >前、后各连续30页，共60页（不足60页的，全部提交），第60页为模块结束页，每页不少于50行</span>，请确认提交代码和登记情况真实匹配，如：编程语言类型核对，软件名称一致性，代码注释申请人一致性：
                  <br />1.是否有
                  <span class="span2">copyright</span>等关键字
                  <br />2.注释是否有非申请人名称等
                  <br />3.软件名称是否和登记名称一致
                  <br />4.上传文件需包含页眉页脚
                </span>
              </div>
            </div>
          </div>
          <div>
            <div class="clearfix" v-if="option1[0] == '4'">
              <h3 class="h4 applyNo96">
                拟申报软件简称
                <span class="required-tag">*</span>
              </h3>
              <el-input
                class="field applyNo96Box input-left"
                placeholder="请输入内容"
                v-model="abbreviation"
              ></el-input>
              <span class="span4 Explanation-right linehighlight40">例：溟宇科惠</span>
            </div>
            <div class="clearfix" v-if="option1[0] == '4'">
              <h3 class="h4 applyNo97">
                拟申报软件全称
                <span class="required-tag">*</span>
              </h3>
              <el-input class="field applyNo97Box input-left" placeholder="请输入内容" v-model="name"></el-input>
              <span class="span4 Explanation-right linehighlight40">例：溟宇科惠知识产权管理系统</span>
            </div>
            <div class="clearfix" v-if="option1[0] == '4'">
              <h3 class="h4 applyNo11">
                著作权人
                <span class="required-tag">*</span>
              </h3>
              <el-input
                class="field applyNo11Box input-left"
                v-model="patentedPerson"
                placeholder="请输入著作权人"
              ></el-input>
              <ul class="ul Explanation-right">
                <li>
                  <span class="span4">1. 如果著作权人为单位，请填写单位名称，如XXXXXX公司，XXXXXXX学校等</span>
                </li>
                <li>
                  <span class="span4">2. 如果著作权人为个人，请填写个人姓名，如张三</span>
                </li>
              </ul>
            </div>
            <div class="clearfix" v-if="option1[0] != '4'">
              <h3 class="h4 applyNo9">
                拟申报专利类型
                <span class="required-tag">*</span>
              </h3>
              <el-select
                class="applyNo9Box input-left"
                v-model="patent"
                multiple
                placeholder="请选择专利类型"
              >
                <el-option
                  v-for="item in patentArr"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
              <span class="span4 Explanation-right linehighlight40">
                可多选，如果选择
                <span class="span2">不确定</span>则由代理人根据提交内容确定
              </span>
            </div>
            <div class="clearfix" v-if="option1[0] != '4'">
              <h3 class="h4 applyNo10">
                拟申报专利名称
                <span class="required-tag">*</span>
              </h3>
              <el-input
                class="field applyNo10Box input-left"
                placeholder="请输入内容"
                v-model="patentName"
              ></el-input>
              <span class="span4 Explanation-right linehighlight40">此内容仅供代理人参考，具体专利名称以最后申报定稿时为准</span>
            </div>
            <div class="tableTitle" v-if="option1[0] != '4'">
              <span class="midText">
                <h3 class="center-title">专利权人信息</h3>
              </span>
            </div>
            <div class="clearfix" v-if="option1[0] != '4'">
              <h3 class="h4 applyNo11">
                专利权人
                <span class="required-tag">*</span>
              </h3>
              <el-autocomplete
                class="field applyNo11Box input-left"
                v-model="patentedPerson"
                :fetch-suggestions="querySearch1"
                :trigger-on-focus="false"
                placeholder="请输入专利权人"
                :validate-event="false"
                @blur="valueChange($event)"
                @select="handleSelect1"
              ></el-autocomplete>

              <ul class="ul Explanation-right">
                <li>
                  <span class="span4">1. 专利权人如果为单位，请填写单位名称，如XXXXXX公司，XXXXXXX学校等</span>
                </li>
                <li>
                  <span class="span4">2. 如果专利权人为个人，请填写个人姓名，如张三</span>
                </li>
                <li>
                  <span
                    class="span2"
                  >3. 若专利权人为个人，办理专利费用减缴备案后即可享受相应比例的专利费用减缴，备案资料：上一年度年收入低于6万元的收入证明以及个人身份证明文件</span>
                </li>
              </ul>
            </div>
            <div class="tableTitle" v-if="option1[0] != '4'">
              <span class="midText">
                <h3 class="center-title">发明人信息</h3>
              </span>
            </div>

            <div class="clearfix" v-if="option1[0] != '4'">
              <h3 class="h4 applyNo12">
                发明人姓名
                <span class="required-tag">*</span>
              </h3>
              <el-input
                class="field applyNo12Box input-left"
                placeholder="请输入内容"
                v-model="inventor"
                @blur="getInventor"
              ></el-input>
              <span class="span4 Explanation-right linehighlight40">
                如有多个，请用中文逗号隔开，
                <span class="span2">第一发明人请放在首位</span>，如，张三（第一发明人），李四，王五
              </span>
            </div>

            <div class="clearfix" v-if="option1[0] != '4'">
              <h3 class="h4 applyNo13">
                第一发明人身份证号码
                <span class="required-tag">*</span>
              </h3>
              <el-input class="field applyNo13Box input-left" placeholder="请输入内容" v-model="IDCard"></el-input>
              <span class="span4 Explanation-right linehighlight40">请填写正确的18位身份证号码</span>
            </div>

            <div class="tableTitle">
              <span class="midText">
                <h3 class="center-title">联络人信息</h3>
              </span>
            </div>

            <div class="clearfix">
              <h3 class="h4 applyNo14">
                联络人（只写一个）
                <span class="required-tag">*</span>
              </h3>
              <el-input
                class="field applyNo14Box input-left"
                placeholder="请输入内容"
                v-model="contacts"
              ></el-input>
              <span class="span4 Explanation-right linehighlight40">请填写联络人姓名</span>
            </div>
            <div class="clearfix">
              <h3 class="h4 applyNo15">
                联络人电话
                <span class="required-tag">*</span>
              </h3>
              <el-input
                class="field applyNo15Box input-left"
                placeholder="请输入内容"
                @blur="changePhone"
                v-model="contactsPhone"
              ></el-input>
              <span class="span4 Explanation-right linehighlight40">请填写正确的手机号码</span>
            </div>
            <div class="clearfix">
              <h3 class="h4 applyNo16">
                联络人邮箱
                <span class="required-tag">*</span>
              </h3>
              <el-input class="field applyNo16Box input-left" placeholder="请输入内容" v-model="email"></el-input>
              <span
                class="span2 Explanation-right linehighlight40"
              >#注意：邮箱务必可用，除电话沟通外，代理人可能选择邮箱跟您确认相关内容#</span>
            </div>
          </div>
          <div v-if="false">
            <div>
              <div class="tableTitle">
                <span class="midText">
                  <h3 class="center-title">申请人信息</h3>
                </span>
              </div>
            </div>
            <div>
              <div class="tableTitle">
                <span class="midText">
                  <h3 class="center-title">商标注册</h3>
                </span>
              </div>
              <h4 class="h4 applyNo20">
                商标类型
                <span class="required-tag">*</span>
              </h4>
              <el-radio-group v-model="trademarkType" class="applyNo20Box">
                <el-radio label="1">文字商标</el-radio>
                <el-radio label="2">图形商标</el-radio>
                <el-radio label="3">文字图形组合商标</el-radio>
              </el-radio-group>
              <br />
              <br />
              <div v-if="trademarkType != '2'">
                <h4 class="h4 applyNo21" style="display: initial;">
                  商标名称
                  <span class="required-tag">*</span>
                </h4>
                <el-input class="field applyNo21Box" placeholder="请输入商标名称" v-model="trademarkName"></el-input>
              </div>
              <br />
              <h4 class="h4 applyNo22" style="display: initial;">
                商标说明
                <span class="required-tag">*</span>
              </h4>
              <el-input
                class="field applyNo22Box"
                type="textarea"
                placeholder="请输入商标说明例：商标由中文“**”英文“**”及图形构成，无特殊含义。只能使用简体中文、英文或阿拉伯数字，不支持其他字符； 商标说明长度应在180个字符以内（汉字算两个字符）。"
                v-model="trademarkText"
                :autosize="{ minRows: 4, maxRows: 4}"
              ></el-input>
              <h4 class="h4 applyNo23">
                商标图样
                <span class="required-tag">*</span>
              </h4>
              <div v-if="trademarkType=='1'">
                <el-radio-group v-model="pictureType1" class="applyNo23Box">
                  <el-radio label="1">自动生成</el-radio>
                  <el-radio label="2">手动生成</el-radio>
                </el-radio-group>
                <br />
                <br />
              </div>
              <div v-if="pictureType1=='2' || trademarkType=='2' || trademarkType=='3'">
                <el-radio-group v-model="pictureType2">
                  <el-radio label="1" border>黑白图样</el-radio>
                  <el-radio label="2" border>彩色图样</el-radio>
                </el-radio-group>
                <br />
                <el-upload
                  class="upload-demo"
                  :limit="1"
                  ref="upload"
                  :action="uploadImgUrl"
                  :on-preview="handlePreview"
                  :on-remove="handleRemove"
                  list-type="picture-card"
                  :on-success="handleSuccess"
                  :file-list="fileList"
                  :auto-upload="true"
                  :before-upload="beforeUpload"
                  multiple
                >
                  <i class="el-icon-plus"></i>
                  <div slot="tip" class="el-upload__tip">
                    <el-checkbox v-model="isColour">若图样为彩色，则按照指定颜色递交商标局。</el-checkbox>
                    <br />
                    <br />
                    <p>
                      <i class="el-icon-warning-outline" style="font-size: large;"></i>&nbsp;手动上传的商标图样应为200K以内的jpg格式图片，分辨率为500*500~1500*1500。
                    </p>
                    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;溟宇科惠建议使用黑白图样申请商标</p>
                    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;若上传黑白图样，注册后可以根据需求任意更换商标颜色，均被视为注册商标。</p>
                    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;若上传彩色图样，则注册后只能按照上传图样的颜色进行使用，才被认定为注册商标。</p>
                    <p
                      style="color: red;"
                    >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;如您上传的为彩色图样则溟宇科惠将按照指定颜色商标进行递交</p>
                  </div>
                </el-upload>
              </div>
              <h4 class="h4 applyNo24">
                商标类别
                <span class="required-tag">*</span>
              </h4>
              <el-input class="field applyNo24Box" placeholder="请输入内容" v-model="trademarkCategory"></el-input>
            </div>
          </div>
        </div>
      </div>
      <center class="submit-btn">
        <el-button
          v-no-more-click:3000
          type="primary"
          :loading="submitLoading"
          @click="submit"
        >&nbsp;&nbsp;&nbsp;&nbsp;提交&nbsp;&nbsp;&nbsp;&nbsp;</el-button>
      </center>

      <!-- 确认弹窗 -->
      <el-dialog
        title="您的订单提交成功！"
        :visible.sync="dialogVisible"
        :close-on-click-modal="false"
        :close-on-press-escape="false"
        :show-close="false"
        center
        width="30%"
      >
        <template v-if="dialogData">
          <span class="confirmText">
            &emsp;&emsp;订单编号：
            <font color="green">{{ dialogData.order_number }}</font>，
            您的专属顾问是：
            <font
              color="green"
            >{{dialogData.process.email_work.split("@")[0].split("followup")[1] }}</font>号，
            48小时之内会和您联系。如果您对该订单有任何疑问也可以主动联系专属顾问，
            联系电话：
            <font
              color="green"
            >{{ dialogData.process.phone }}</font>。
          </span>
        </template>
        <span slot="footer" class="dialog-footer clearfloat">
          <el-button v-no-more-click:3000 v-if="getUser" @click="goHome">{{getSumbitBtnText}}</el-button>
          <el-button v-no-more-click:3000 v-else @click="goLogin">去登录</el-button>
          <el-button v-no-more-click:3000 type="primary" @click="proceed()">继续申请</el-button>
        </span>
      </el-dialog>
    </div>
    <!-- <div class="copyright-information">
			{{RECORD}}
    </div>-->
  </div>
</template>

<script>
import { validation } from "./validate";
import { scroll } from "~/util/index.js";
import uploadFile from "~/components/upload-file";
import axios from "axios";
import { RECORD } from "~/util/config.js";
export default {
  components: {
    uploadFile
  },
  data() {
    return {
      RECORD: RECORD,
      baseUrl: global.baseurl,
      currentType: "",
      application_number:'', // 申请号
      order_status:'', // 外部订单状态
      checkFileList:[], 
      check_FileList:[], // 审查意见
      appealFileList:[],
      appeal_FileList:[], // 申请文件
      order_type:'发明专利', // 订单类型
      orderOption:['1'],
      orderType:[
        {
          value:'1',
          label:'发明专利'
        },
        {
          value:'2',
          label:'实用新型'
        },
        {
          value:'3',
          label:'外观设计'
        },
      ],
      options: [
        {
          value: "1",
          label: "idea模式"
        },
        {
          value: "2",
          label: "技术交底模式",
          children: [
            {
              value: "a",
              label: "在线填写"
            },
            {
              value: "b",
              label: "上传文件"
            }
          ]
        },
        {
          value: "3",
          label: "定向导航"
        },
        {
          value: "4",
          label: "软件著作权",
          children: [
            {
              value: "1",
              label: "有源码"
            },
            {
              value: "0",
              label: "无源码"
            }
          ]
        },
        // {
        //   value: "5",
        //   label: "申诉案件"
        // },
        // ,
        // {
        //   value: "6",
        //   label: "答复案件"
        // }
      ],
      trademarkType: "1",
      trademarkName: "",
      trademarkText: "",
      pictureType1: "1",
      pictureType2: "1",
      isColour: false,
      trademarkCategory: "",
      option5Val1: "",
      option5Val2: "",
      option5Val3: "",
      option5Val4: "",
      option5Val5: "",
      option5Val6: "1",
      option5Val7: "",
      option5Val8: "",
      option5Val9: "",
      option5Val10: "",
      option5Val11: "",
      option5Val12: "",
      option5Val13: "",
      option5Val14: "",
      option5Val15: "",
      option5Val16: "",
      option5Val17: "",
      agentArr: [], //代理人列表
      subscriptioImg: require("~/assets/img/CRCODE.png"),
      subscriptioImg1: require("~/assets/img/CRCODE2.png"),
      uploadImgUrl: global.baseurl + "/api/upload/img",
      uploadFileUrl: global.baseurl + "/api/upload/file",
      logoImg: require("~/assets/img/20191017101604.png"),
      option1: ["1"], //'请选择',
      option2: "N", //'请选择',
      option3: "N", //'请选择',
      option4: "C",
      field: "",
      textarea: "",
      textarea2: "",
      textarea3: "",
      textarea4: "",
      textarea5: "",
      isHiddenTextarea: true,
      fileList: [],
      fileList2: [],
      fileListV: [],
      fileList2V: [],
      option1Arr: [
        {
          value: 1,
          label: 1
        },
        {
          value: 2,
          label: 2
        },
        {
          value: 3,
          label: 3
        }
      ],
      option2Arr: [
        {
          value: "N",
          label: "N"
        },
        {
          value: "Q",
          label: "Q"
        },
        {
          value: "A",
          label: "A"
        },
        {
          value: "QA",
          label: "QA"
        }
      ],
      option3Arr: [
        {
          value: "Y",
          label: "Y"
        },
        {
          value: "N",
          label: "N"
        }
      ],
      option4Arr: [
        {
          value: "A",
          label: "10个工作日"
        },
        {
          value: "B",
          label: "20个工作日"
        },
        {
          value: "C",
          label: "30个工作日"
        }
      ],
      option5Arr: [
        {
          value: "1",
          label: "个人"
        },
        {
          value: "2",
          label: "企业"
        }
      ],
      option6Arr: [
        {
          value: "1",
          label: "身份证号码"
        },
        {
          value: "2",
          label: "营业执照"
        }
      ],
      patentArr: [
        {
          value: "发明专利",
          label: "发明专利"
        },
        {
          value: "实用新型",
          label: "实用新型"
        },
        {
          value: "外观设计",
          label: "外观设计"
        },
        {
          value: "不确定",
          label: "不确定"
        }
      ],
      patent: [],
      patentName: "",
      patentedPerson: "",
      inventor: "",
      IDCard: "",
      contacts: "",
      contactsPhone: "",
      email: "",
      agent: "",
      isHiddenDrop: true,
      country: [
        {
          label: "热门国家",
          options: [
            {
              value: "China",
              label: "中国"
            }
          ]
        },
        {
          label: "所有国家",
          options: [
            {
              value: "Angola",
              label: "安哥拉"
            },
            {
              value: "Afghanistan",
              label: "阿富汗"
            },
            {
              value: "Albania",
              label: "阿尔巴尼亚"
            },
            {
              value: "Algeria",
              label: "阿尔及利亚"
            },
            {
              value: "Andorra",
              label: "安道尔共和国"
            },
            {
              value: "Anguilla",
              label: "安圭拉岛"
            },
            {
              value: "Antigua and Barbuda",
              label: "安提瓜和巴布达"
            },
            {
              value: "Argentina",
              label: "阿根廷"
            },
            {
              value: "Armenia",
              label: "亚美尼亚"
            },
            {
              value: "Ascension",
              label: "阿森松"
            },
            {
              value: "Australia",
              label: "澳大利亚"
            },
            {
              value: "Austria",
              label: "奥地利"
            },
            {
              value: "Azerbaijan",
              label: "阿塞拜疆"
            },
            {
              value: "Bahamas",
              label: "巴哈马"
            },
            {
              value: "Bahrain",
              label: "巴林"
            },
            {
              value: "Bangladesh",
              label: "孟加拉国"
            },
            {
              value: "Barbados",
              label: "巴巴多斯"
            },
            {
              value: "Belarus",
              label: "白俄罗斯"
            },
            {
              value: "Belgium",
              label: "比利时"
            },
            {
              value: "Belize",
              label: "伯利兹"
            },
            {
              value: "Benin",
              label: "贝宁"
            },
            {
              value: "Bermuda Is",
              label: "百慕大群岛"
            },
            {
              value: "Bolivia",
              label: "玻利维亚"
            },
            {
              value: "Botswana",
              label: "博茨瓦纳"
            },
            {
              value: "Brazil",
              label: "巴西"
            },
            {
              value: "Brunei",
              label: "文莱"
            },
            {
              value: "Bulgaria",
              label: "保加利亚"
            },
            {
              value: "Burkina Faso",
              label: "布基纳法索"
            },
            {
              value: "Burma",
              label: "缅甸"
            },
            {
              value: "Burundi",
              label: "布隆迪"
            },
            {
              value: "Cameroon",
              label: "喀麦隆"
            },
            {
              value: "Canada",
              label: "加拿大"
            },
            {
              value: "Cayman Is",
              label: "开曼群岛"
            },
            {
              value: "Central African Republic",
              label: "中非共和国"
            },
            {
              value: "Chad",
              label: "乍得"
            },
            {
              value: "Chile",
              label: "智利"
            },
            {
              value: "China",
              label: "中国"
            },
            {
              value: "Colombia",
              label: "哥伦比亚"
            },
            {
              value: "Congo",
              label: "刚果"
            },
            {
              value: "Cook Is",
              label: "库克群岛"
            },
            {
              value: "Costa Rica",
              label: "哥斯达黎加"
            },
            {
              value: "Cuba",
              label: "古巴"
            },
            {
              value: "Cyprus",
              label: "塞浦路斯"
            },
            {
              value: "Czech Republic",
              label: "捷克"
            },
            {
              value: "Denmark",
              label: "丹麦"
            },
            {
              value: "Djibouti",
              label: "吉布提"
            },
            {
              value: "Dominica Rep",
              label: "多米尼加共和国"
            },
            {
              value: "Ecuador",
              label: "厄瓜多尔"
            },
            {
              value: "Egypt",
              label: "埃及"
            },
            {
              value: "EI Salvador",
              label: "萨尔瓦多"
            },
            {
              value: "Estonia",
              label: "爱沙尼亚"
            },
            {
              value: "Ethiopia",
              label: "埃塞俄比亚"
            },
            {
              value: "Fiji",
              label: "斐济"
            },
            {
              value: "Finland",
              label: "芬兰"
            },
            {
              value: "France",
              label: "法国"
            },
            {
              value: "French Guiana",
              label: "法属圭亚那"
            },
            {
              value: "French Polynesia",
              label: "法属玻利尼西亚"
            },
            {
              value: "Gabon",
              label: "加蓬"
            },
            {
              value: "Gambia",
              label: "冈比亚"
            },
            {
              value: "Georgia",
              label: "格鲁吉亚"
            },
            {
              value: "Germany",
              label: "德国"
            },
            {
              value: "Ghana",
              label: "加纳"
            },
            {
              value: "Gibraltar",
              label: "直布罗陀"
            },
            {
              value: "Greece",
              label: "希腊"
            },
            {
              value: "Grenada",
              label: "格林纳达"
            },
            {
              value: "Guam",
              label: "关岛"
            },
            {
              value: "Guatemala",
              label: "危地马拉"
            },
            {
              value: "Guinea",
              label: "几内亚"
            },
            {
              value: "Guyana",
              label: "圭亚那"
            },
            {
              value: "Haiti",
              label: "海地"
            },
            {
              value: "Honduras",
              label: "洪都拉斯"
            },
            {
              value: "Hungary",
              label: "匈牙利"
            },
            {
              value: "Iceland",
              label: "冰岛"
            },
            {
              value: "India",
              label: "印度"
            },
            {
              value: "Indonesia",
              label: "印度尼西亚"
            },
            {
              value: "Iran",
              label: "伊朗"
            },
            {
              value: "Iraq",
              label: "伊拉克"
            },
            {
              value: "Ireland",
              label: "爱尔兰"
            },
            {
              value: "Israel",
              label: "以色列"
            },
            {
              value: "Italy",
              label: "意大利"
            },
            {
              value: "Ivory Coast",
              label: "科特迪瓦"
            },
            {
              value: "Jamaica",
              label: "牙买加"
            },
            {
              value: "Japan",
              label: "日本"
            },
            {
              value: "Jordan",
              label: "约旦"
            },
            {
              value: "Kampuchea (Cambodia )",
              label: "柬埔寨"
            },
            {
              value: "Kazakstan",
              label: "哈萨克斯坦"
            },
            {
              value: "Kenya",
              label: "肯尼亚"
            },
            {
              value: "Korea",
              label: "韩国"
            },
            {
              value: "Kuwait",
              label: "科威特"
            },
            {
              value: "Kyrgyzstan",
              label: "吉尔吉斯坦"
            },
            {
              value: "Laos",
              label: "老挝"
            },
            {
              value: "Latvia",
              label: "拉脱维亚"
            },
            {
              value: "Lebanon",
              label: "黎巴嫩"
            },
            {
              value: "Lesotho",
              label: "莱索托"
            },
            {
              value: "Liberia",
              label: "利比里亚"
            },
            {
              value: "Libya",
              label: "利比亚"
            },
            {
              value: "Liechtenstein",
              label: "列支敦士登"
            },
            {
              value: "Lithuania",
              label: "立陶宛"
            },
            {
              value: "Luxembourg",
              label: "卢森堡"
            },
            {
              value: "Madagascar",
              label: "马达加斯加"
            },
            {
              value: "Malawi",
              label: "马拉维"
            },
            {
              value: "Malaysia",
              label: "马来西亚"
            },
            {
              value: "Maldives",
              label: "马尔代夫"
            },
            {
              value: "Mali",
              label: "马里"
            },
            {
              value: "Malta",
              label: "马耳他"
            },
            {
              value: "Mariana Is",
              label: "马里亚那群岛"
            },
            {
              value: "Martinique",
              label: "马提尼克"
            },
            {
              value: "Mauritius",
              label: "毛里求斯"
            },
            {
              value: "Mexico",
              label: "墨西哥"
            },
            {
              value: "Moldova",
              label: "摩尔多瓦"
            },
            {
              value: "Monaco",
              label: "摩纳哥"
            },
            {
              value: "Mongolia",
              label: "蒙古"
            },
            {
              value: "Montserrat Is",
              label: "蒙特塞拉特岛"
            },
            {
              value: "Morocco",
              label: "摩洛哥"
            },
            {
              value: "Mozambique",
              label: "莫桑比克"
            },
            {
              value: "Namibia",
              label: "纳米比亚"
            },
            {
              value: "Nauru",
              label: "瑙鲁"
            },
            {
              value: "Nepal",
              label: "尼泊尔"
            },
            {
              value: "Netheriands Antilles",
              label: "荷属安的列斯"
            },
            {
              value: "Netherlands",
              label: "荷兰"
            },
            {
              value: "New Zealand",
              label: "新西兰"
            },
            {
              value: "Nicaragua",
              label: "尼加拉瓜"
            },
            {
              value: "Niger",
              label: "尼日尔"
            },
            {
              value: "Nigeria",
              label: "尼日利亚"
            },
            {
              value: "North Korea",
              label: "朝鲜"
            },
            {
              value: "Norway",
              label: "挪威"
            },
            {
              value: "Oman",
              label: "阿曼"
            },
            {
              value: "Pakistan",
              label: "巴基斯坦"
            },
            {
              value: "Panama",
              label: "巴拿马"
            },
            {
              value: "Papua New Cuinea",
              label: "巴布亚新几内亚"
            },
            {
              value: "Paraguay",
              label: "巴拉圭"
            },
            {
              value: "Peru",
              label: "秘鲁"
            },
            {
              value: "Philippines",
              label: "菲律宾"
            },
            {
              value: "Poland",
              label: "波兰"
            },
            {
              value: "Portugal",
              label: "葡萄牙"
            },
            {
              value: "Puerto Rico",
              label: "波多黎各"
            },
            {
              value: "Qatar",
              label: "卡塔尔"
            },
            {
              value: "Reunion",
              label: "留尼旺"
            },
            {
              value: "Romania",
              label: "罗马尼亚"
            },
            {
              value: "Russia",
              label: "俄罗斯"
            },
            {
              value: "Saint Lueia",
              label: "圣卢西亚"
            },
            {
              value: "Saint Vincent",
              label: "圣文森特岛"
            },
            {
              value: "Samoa Eastern",
              label: "东萨摩亚(美)"
            },
            {
              value: "Samoa Western",
              label: "西萨摩亚"
            },
            {
              value: "San Marino",
              label: "圣马力诺"
            },
            {
              value: "Sao Tome and Principe",
              label: "圣多美和普林西比"
            },
            {
              value: "Saudi Arabia",
              label: "沙特阿拉伯"
            },
            {
              value: "Senegal",
              label: "塞内加尔"
            },
            {
              value: "Seychelles",
              label: "塞舌尔"
            },
            {
              value: "Sierra Leone",
              label: "塞拉利昂"
            },
            {
              value: "Singapore",
              label: "新加坡"
            },
            {
              value: "Slovakia",
              label: "斯洛伐克"
            },
            {
              value: "Slovenia",
              label: "斯洛文尼亚"
            },
            {
              value: "Solomon Is",
              label: "所罗门群岛"
            },
            {
              value: "Somali",
              label: "索马里"
            },
            {
              value: "South Africa",
              label: "南非"
            },
            {
              value: "Spain",
              label: "西班牙"
            },
            {
              value: "SriLanka",
              label: "斯里兰卡"
            },
            {
              value: "St.Lucia",
              label: "圣卢西亚"
            },
            {
              value: "St.Vincent",
              label: "圣文森特"
            },
            {
              value: "Sudan",
              label: "苏丹"
            },
            {
              value: "Suriname",
              label: "苏里南"
            },
            {
              value: "Swaziland",
              label: "斯威士兰"
            },
            {
              value: "Sweden",
              label: "瑞典"
            },
            {
              value: "Switzerland",
              label: "瑞士"
            },
            {
              value: "Syria",
              label: "叙利亚"
            },
            {
              value: "Tajikstan",
              label: "塔吉克斯坦"
            },
            {
              value: "Tanzania",
              label: "坦桑尼亚"
            },
            {
              value: "Thailand",
              label: "泰国"
            },
            {
              value: "Togo",
              label: "多哥"
            },
            {
              value: "Tonga",
              label: "汤加"
            },
            {
              value: "Trinidad and Tobago",
              label: "特立尼达和多巴哥"
            },
            {
              value: "Tunisia",
              label: "突尼斯"
            },
            {
              value: "Turkey",
              label: "土耳其"
            },
            {
              value: "Turkmenistan",
              label: "土库曼斯坦"
            },
            {
              value: "Uganda",
              label: "乌干达"
            },
            {
              value: "Ukraine",
              label: "乌克兰"
            },
            {
              value: "United Arab Emirates",
              label: "阿拉伯联合酋长国"
            },
            {
              value: "United Kiongdom",
              label: "英国"
            },
            {
              value: "United States of America",
              label: "美国"
            },
            {
              value: "Uruguay",
              label: "乌拉圭"
            },
            {
              value: "Uzbekistan",
              label: "乌兹别克斯坦"
            },
            {
              value: "Venezuela",
              label: "委内瑞拉"
            },
            {
              value: "Vietnam",
              label: "越南"
            },
            {
              value: "Yemen",
              label: "也门"
            },
            {
              value: "Yugoslavia",
              label: "南斯拉夫"
            },
            {
              value: "Zimbabwe",
              label: "津巴布韦"
            },
            {
              value: "Zaire",
              label: "扎伊尔"
            },
            {
              value: "Zambia",
              label: "赞比亚"
            }
          ]
        }
      ],
      dialogVisible: false,
      dialogData: null,
      submitLoading: false,
      fromOne: true,
      restaurants: [],
      patentUserPrompt: true,
      rejectFile: [], 
      reject_file: [], // 驳回通知书
      appeal_file: [], // 申诉文件
      instruction_file: [], // 说明文件
      code_file: [], // 源码文件
      name: "", // 软件著作全称
      abbreviation: "", // 软件著作简称
      fields: [], // 所属领域
      show_file: true,
      isSelectShow: true,
      ifChangePhone: true,
    };
  },
  created() {
    this.getFieIds();
    if (this.$route.query.from == 1) {
      this.fromOne = false;
    }
    let that = this;
    this.getAllPatent();
    // 判断有无cookie 如果有 默认填写 发明人，联系电话，专利权人，邮箱
    let userData = JSON.stringify(this.$store.state.user);
    if (userData === "{}") {
    } else {
      this.inventor = this.$store.state.user.name;
      this.contactsPhone = this.$store.state.user.phone;
      this.contacts = this.$store.state.user.name;
      if (this.$store.state.user.liaison) {
        this.email = this.$store.state.user.liaison.email;
        this.patentedPerson = this.$store.state.user.liaison.organization;
        this.IDCard = this.$store.state.user.liaison.id_card;
      }
    }
  },
  computed: {
    getUser() {
      if (JSON.stringify(this.$store.state.user) === "{}") {
        return false;
      } else {
        return true;
      }
    },
    getSumbitType() {
      if (this.$route.query.sumbit_type) {
        if (this.$route.query.sumbit_type == "2") {
          return true;
        }
      } else {
        return false;
      }
    },
    getSumbitBtnText() {
      if (this.$route.query.sumbit_type) {
        if (this.$route.query.sumbit_type == "2") {
          return "返回";
        }
      } else {
        return "回首页";
      }
    }
  },
  mounted() {
    if (document.getElementsByClassName("order").length >= 0) {
      let top =
        document.getElementsByClassName("order")[0].getBoundingClientRect()
          .top + document.getElementById("QRCODE").clientHeight;
      let left =
        document.getElementsByClassName("order")[0].getBoundingClientRect()
          .left +
        document.getElementsByClassName("order")[0].clientWidth +
        10;
      let top2 = top + 200;
      let jsQRCODE = document.getElementById("QRCODE");
      let jsQRCODE1 = document.getElementById("QRCODE1");
      jsQRCODE.style["top"] = top + "px";
      jsQRCODE1.style["top"] = top2 + "px";

      jsQRCODE.style["left"] = left + "px";
      jsQRCODE1.style["left"] = left + "px";

      jsQRCODE1.style["display"] = "block";
      jsQRCODE.style["display"] = "block";
    }
    //二维码图片随window窗口变化一直吸附在左边的logo图右边。
    window.onresize = () => {
      if (document.getElementsByClassName("order").length >= 0) {
        let top =
          document.getElementsByClassName("order")[0].getBoundingClientRect()
            .top + document.getElementById("QRCODE").clientHeight;
        let left =
          document.getElementsByClassName("order")[0].getBoundingClientRect()
            .left +
          document.getElementsByClassName("order")[0].clientWidth +
          10;
        let top2 = top + 200;

        let jsQRCODE = document.getElementById("QRCODE");
        let jsQRCODE1 = document.getElementById("QRCODE1");

        jsQRCODE.style["top"] = top + "px";
        jsQRCODE1.style["top"] = top2 + "px";

        jsQRCODE.style["left"] = left + "px";
        jsQRCODE1.style["left"] = left + "px";

        jsQRCODE1.style["display"] = "block";
        jsQRCODE.style["display"] = "block";
      }
    };
  },
  methods: {
    visibleChange() {
      let body = document.getElementsByTagName("body")[0];
      body.className = this.className;
    },
    onToggleClssName(data, node) {
      console.log(data.value);
      this.currentType = data.value;
      let body = document.getElementsByTagName("body")[0];
      if (["技术交底模式", "在线填写", "上传文件"].includes(data.label)) {
        body.className = "tw-top";
        this.className = "tw-top";
      } else if (["软件著作权", "有源码", "无源码"].includes(data.label)) {
        body.className = "td-top";
        this.className = "td-top";
      } else {
        body.className = "";
        this.className = "";
      }
    },
    // 获取所属领域
    getFieIds() {
      this.$axios.get("api/agent/trademark_list").then(res => {
        if (res.data.code == 200) {
          let data = res.data.data;
          this.fields = data.map(v => {
            v.label = v.name.split("-")[1];
            v.value = v.label;
            return v;
          });
        } else {
          this.$message({
            type: "error",
            message: "获取擅长领域选项失败"
          });
        }
      });
    },
    explainChange(data) {
      let fileList = data.fileList;
      let arr = [];
      fileList.forEach(v => {
        arr.push(v.raw);
      });
      this.instruction_file = arr;
      // console.log(this.instruction_file)
    },
    codeChange(data) {
      let fileList = data.fileList;
      let arr = [];
      fileList.forEach(v => {
        arr.push(v.raw);
      });
      this.code_file = arr;
    },
    //图片上传
    handlePreview(file) {},
    handleRemove(file, fileList) {
      let that = this;
      //从服务器也删除此文件
      that.$axios.delete("/api/delete/file", {
        data: {
          path: that.fileListV[fileList.length]
        }
      });
      that.fileListV.splice(fileList.length, 1);
    },
    handleSuccess(res, file, fileList) {
      this.fileListV.push(res.data);
    },
    beforeUpload(file) {
      let that = this;
      let canUpload = true; //是否能够上传（布尔值）
      let type = file.name.substring(file.name.lastIndexOf(".") + 1);
      //不区分大小写
      if (!/jpg|jpeg|png|gif/i.test(type)) {
        that.$message({
          message: "文件格式只能是jpg/jpeg/png/gif",
          type: "warning"
        });
        canUpload = false;
      }
      let size = file.size / 1024 / 1024;
      if (size > 10) {
        that.$message({
          message: "文件大小不能超过10M",
          type: "warning"
        });
        canUpload = false;
      }
      return canUpload;
    },
    submitUpload() {
      this.$refs.upload.submit();
    },
    //文件上传
    handlePreview2(file) {},
    handleRemove2(file, fileList) {
      let that = this;
      //从服务器也删除此文件
      that.$axios.delete("/api/delete/file", {
        data: {
          path: that.fileList2V[fileList.length]
        }
      });
      that.fileList2V.splice(fileList.length, 1);
    },
    handleSuccess2(res, file, fileList) {
      this.fileList2V.push(res.data);
    },
    beforeUpload2(file) {
      let that = this;
      let canUpload = true; //是否能够上传（布尔值）
      let type = file.name.substring(file.name.lastIndexOf(".") + 1);
      //不区分大小写
      if (!/doc|docx/i.test(type)) {
        that.$message({
          message: "文件格式只能是dov 或者 docx格式",
          type: "warning"
        });
        canUpload = false;
      }
      let size = file.size / 1024 / 1024;
      if (size > 100) {
        that.$message({
          message: "文件大小不能超过100M",
          type: "warning"
        });
        canUpload = false;
      }
      return canUpload;
    },
    beforeCheckUpload(file){
      // 上传文件判断
      const isIMAGE = file.name.endsWith('.zip' || '.pdf');
      const isLt1M = file.size / 1024 / 1024 < 10;

      if (!isIMAGE) {
        this.$message.error('上传文件只能单个PDF或zip压缩文件!');
        this.checkFileList =[]; // 数组就置为空
      } else if (!isLt1M) {
        this.$message.error('上传文件大小不能超过 10MB!');
        this.checkFileList =[]; //数组就置为空
      } else {
        this.checkFileList =[file]
      }
    },
    beforeAppealUpload(file){
      // 上传文件判断
      // console.log(file)
      const isIMAGE = file.name.endsWith('.zip' || '.rar');
      const isLt1M = file.size / 1024 / 1024 < 10;

      if (!isIMAGE) {
        this.$message.error('申请文件只能为压缩文件!');
        this.appealFileList =[]; // 数组就置为空
      } else if (!isLt1M) {
        this.$message.error('上传文件大小不能超过 10MB!');
        this.appealFileList =[]; //数组就置为空
      } else {
        this.appealFileList =[file]
      }
    },
    beforeFileCheckUpload(file){
      // 上传文件判断
      // console.log(file)
      const isIMAGE = file.name.endsWith('.docx' || '.doc');
      const isLt1M = file.size / 1024 / 1024 < 10;

      if (!isIMAGE) {
        this.$message.error('申请文件只能为docx和doc文件!');
        this.rejectFile =[]; // 数组就置为空
      } else if (!isLt1M) {
        this.$message.error('上传文件大小不能超过 10MB!');
        this.rejectFile =[]; //数组就置为空
      } else {
        this.rejectFile =[file]
      }
    },
    submitUpload2() {
      this.$refs.upload2.submit();
    },
    testPay() {
      this.$router.push({
        // path: '/payment',
        path: "/articleDetail",
        name: "payment"
        // params: {
        // 	order_number: 123,
        // 	type: '发明专利',
        // 	moeny: 998
        // }
      });
    },
    successUpload(response, file, fileList){
      console.log(file)
      console.log(fileList)
      console.log(response)
      console.log(response.data)
      
      this.check_FileList = file
    },
    successUpload2(response, file, fileList){
      console.log(file)
      this.appeal_FileList = file
    },
    successFileUpload(response, file, fileList){
      console.log(file)
      this.reject_file = file
    },
    // 订单类型 (申述案件/答复案件)
    orderTypeName(data, node){
      // this.order_type = data.value
      this.order_type = data.label
      console.log(data.label)
    },
    submit() {
      let that = this;
      if(that.currentType == 5 || that.currentType == 6){
        // this.$alert('案件提交')
        if(that.currentType == 5){
          that.order_status = '等待申诉'
          // FormData 对象
          var formData = new FormData();
          formData.append("appeal_FileList", that.appeal_FileList);
          formData.append("reject_file", that.reject_file);
          formData.append("check_FileList", that.check_FileList);
          let apply_file = formData.get("appeal_FileList")
          let reject_file = formData.get("reject_file")
          let check_file = formData.get("check_FileList")
          let params = {
            application_number: that.application_number,
            status: that.order_status,
            type: that.order_type,
            apply_file: apply_file,
            reject_file: reject_file,
            check_file: check_file,
            patent_user: that.patentedPerson,
            liaisons: that.contacts,
            liaisons_tel:that.contactsPhone,
            liaisons_email: that.email,
          }
          console.log(params)
        
          that.$axios.post('/api/finals/add_appeal_finals',params).then(res => {
            console.log(res)
            if (res.data.code == 200) {
              console.log(res.data)
            }
          })
        } else {
          that.order_status = '等待答复'
          // FormData 对象
          var formData = new FormData();
          formData.append("apply_file", that.appeal_FileList);
          formData.append("check_file", that.check_FileList);
          formData.append("application_number", that.application_number);
          formData.append("status", that.order_status);
          formData.append("type", that.order_type);
          formData.append("patent_user", that.patentedPerson);
          formData.append("liaisons", that.contacts);
          formData.append("liaisons_tel", that.contactsPhone);
          formData.append("liaisons_email", that.email);
          // let apply_file = formData.get("appeal_FileList")
          // let check_file = formData.get("check_FileList")
          // let params = {
          //   application_number: that.application_number,
          //   status: that.order_status,
          //   type: that.order_type,
          //   apply_file: apply_file,
          //   check_file: check_file,
          //   patent_user: that.patentedPerson,
          //   liaisons: that.contacts,
          //   liaisons_tel: that.contactsPhone,
          //   liaisons_email: that.email,
          // }
          // console.log(params)
          console.log(formData.get('liaisons_email'))
          console.log(formData)
        
          that.$axios.post('api/finals/add_appeal_finals',{params:formData}).then(res => {
            console.log(res)
            if (res.data.code == 200) {
              console.log(res.data)
            }
          })
        }
        
      } else {
        //效验数据
        let validationError = "";
        if (
          this.option1[0] == "1" ||
          this.option1[0] == "2" ||
          this.option1[0] == "3"
        ) {
          validationError = validation({
            option1: that.option1,
            option4: that.option4,
            field: that.field,
            textarea: that.textarea,
            textarea2: that.textarea2,
            textarea3: that.textarea3,
            textarea4: that.textarea4,
            textarea5: that.textarea5,
            patent: that.patent,
            patentName: that.patentName,
            patentedPerson: that.patentedPerson,
            inventor: that.inventor,
            IDCard: that.IDCard,
            contacts: that.contacts,
            contactsPhone: that.contactsPhone,
            email: that.email,
            option3: that.option3,
            agent: that.agent,
            img: that.fileListV.join("&"),
            file:
              that.option1[0] == "3" || that.option1[1] == "b"
                ? that.fileList2V.join("&")
                : ""
          });
        }
        if (this.option1[0] == 4) {
          let params = {
            option1: that.option1,
            instruction_file: that.instruction_file,
            code_file: that.code_file,
            name: that.name,
            abbreviation: that.abbreviation,
            liaisons: that.contacts,
            liaisons_tel: that.contactsPhone,
            patentedPerson: that.patentedPerson,
            liaisons_email: that.email
          };
          validationError = validation(params);
        }
        if (validationError === "") {
          let parameter = {};
          if (that.option1[0] != 4) {
            parameter = {
              problem: that.textarea2,
              pattern: that.option1[0],
              service: that.option4,
              plan: that.textarea3,
              advantage: that.textarea4,
              img: that.fileListV.join("&"),
              type: that.patent.join(","),
              patent_name: that.patentName,
              patent_user: that.patentedPerson,
              user_name: that.inventor,
              id_card: that.IDCard,
              liaisons: that.contacts,
              liaisons_tel: that.contactsPhone,
              liaisons_email: that.email,
              zixuan: that.option3,
              //非必传
              file:
                that.option1[0] == "3" || that.option1[1] == "b"
                  ? that.fileList2V.join("&")
                  : "",
              way: that.option1[1] == "a" ? that.textarea5 : "",
              territory: that.isHiddenTextarea ? "" : that.field,
              background: that.isHiddenTextarea ? "" : that.textarea,
              agent_name: that.option3 == "Y" ? that.agent : ""
            };
            if (!this.fromOne) {
              parameter.from = 1;
            }
            if (this.getSumbitType) {
              parameter.submit_type = "2";
              parameter.author_id = this.$store.state.user.id;
            }
          }
          console.log(parameter)
          this.submitLoading = true;
          if (this.option1[0] != 4) {
            that.$axios.post("/api/order", parameter).then(res => {
              if (res.data.code == 200) {
                this.dialogData = res.data.data;
                this.dialogVisible = true;
                this.submitLoading = false;

                // this.$router.push({
                // 	name: 'payment',
                // 	query: {
                // 		order_id: res.data.data.id
                // 	}
                // })

                // that.$message({
                // 	message: '订单提交成功！',
                //   type: 'success'
                // });
                // that.dialogVisible = true
                //发送邮件
                // if(res.data.agent && res.data.agent.id){
                // 	that.$axios.post('/api/'+res.data.agent.id+'/send/'+res.data.id+'/email')
                // 	.then(res => {
                // 		that.$router.push({
                // 			name: 'index'
                // 		})
                // 	})
                // }else{
                //
                // }
              } else {
                //清空上传的图片和附件
                this.submitLoading = false;
                let delFileList = [];
                delFileList.push(...that.fileListV);
                delFileList.push(...that.fileList2V);
                if (delFileList.length > 0) {
                  that.$axios
                    .delete("/api/delete/file", {
                      data: {
                        path: delFileList.join("&")
                      }
                    })
                    .then(res => {
                      that.fileList.splice(0, that.fileList.length);
                      that.fileListV.splice(0, that.fileListV.length);
                      that.fileList2.splice(0, that.fileList2.length);
                      that.fileList2V.splice(0, that.fileList2V.length);
                    });
                } else {
                  that.fileList.splice(0, that.fileList.length);
                  that.fileListV.splice(0, that.fileListV.length);
                  that.fileList2.splice(0, that.fileList2.length);
                  that.fileList2V.splice(0, that.fileList2V.length);
                }
                that.$message({
                  message: res.data.message,
                  type: "error"
                });
              }
            });
          } else if (this.option1[0] == 4) {
            parameter = {
              name: this.name,
              abbreviation: this.abbreviation,
              liaisons: this.contacts,
              liaisons_tel: this.contactsPhone,
              liaisons_email: this.email,
              patent_user: this.patentedPerson,
              instruction_file: this.instruction_file[0]
            };
            if (this.code_file[0]) {
              parameter.code_file = this.code_file[0];
            }
            let form = new FormData();
            if (this.getSumbitType) {
              parameter.submit_type = "2";
              parameter.author_id = this.$store.state.user.id;
            }
            for (let i in parameter) {
              form.append(i, parameter[i]);
            }
            if (!this.fromOne) {
              form.append("from", 1);
            }

            let userData = JSON.stringify(this.$store.state.user);
            if (userData === "{}") {
            } else {
            }
            axios({
              method: "post",
              url: this.baseUrl + `/api/software`,
              data: form,
              headers: {
                "Content-Type": "multipart/form-data",
                Authorization: "Bearer " + this.$store.state.token
              }
            })
              .then(res => {
                if (res.data.code == 200) {
                  this.dialogData = res.data.data;
                  this.dialogVisible = true;
                  // this.$router.push({
                  // 	name: 'payment',
                  // 	query: {
                  // 		order_id: res.data.data.id
                  // 	}
                  // })
                  this.submitLoading = false;
                } else {
                  this.$message({
                    type: "error",
                    message: res.data.message
                  });
                }
              })
              .catch(e => {});
          }
        } else {
          that.$message({
            message: validationError.text,
            type: "warning"
          });
          //滑动到需要修改的选项处
          scroll("." + validationError.ele);
          //聚焦到需要修改的选项处
          document
            .getElementsByClassName(validationError.ele + "Box")[0]
            .getElementsByTagName(validationError.tag)[0]
            .focus();
        }
      }
      
    },
    querySearch(queryString, cb) {
      let that = this;
      var agentArr = this.agentArr;
      var results = queryString
        ? agentArr.filter(that.createFilter(queryString))
        : agentArr;

      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    createFilter(queryString) {
      return agentArr => {
        //===0代表从首个字符处匹配必须成功，>=0代表从任意字符处匹配必须成功
        return (
          agentArr.value.toLowerCase().indexOf(queryString.toLowerCase()) >= 0
        );
      };
    },
    selectAgent(item) {
      this.agent = item.name;
    },
    //代理人名称必须输入全名
    selectBlur() {
      let that = this;
      let hasAgent = false;
      for (let key in that.agentArr) {
        if (that.agentArr[key] == that.agent) {
          hasAgent = true;
          break;
        }
      }
      if (!hasAgent) {
        that.agent = "";
      }
    },
    getInventor() {
      if (this.inventor.length == 0) {
        return (this.IDCard = "");
      }
      let name = this.inventor.split("，")[0];
      this.$axios.get(`/api/liaison?name=${name}`).then(res => {
        if (res.data.code === 200) {
          if (res.data.data && res.data.data.length) {
            let idCardList = res.data.data.map(result => result.id_card);
            if (idCardList && idCardList.length === 1) {
              this.IDCard = idCardList[0];
            } else {
              this.IDCard = "";
            }
          }
        }
      });
    },
    //根据文字生成图片
    canvasWrapText(options) {
      //绘制文字到canvas，判断换行位置，和设置canvas高度
      var settings = {
        canvas: document.getElementsByTagName("canvas")[0], //canvas对象，必填，不填写默认找到页面中的第一个canvas
        canvasWidth: 480, //canvas的宽度
        drawStartX: 10, //绘制字符串起始x坐标
        drawStartY: 30, //绘制字符串起始y坐标
        lineHeight: 30, //文字的行高
        font: "24px 'Microsoft Yahei'", //文字样式
        text: "请修改掉默认的配置", //需要绘制的文本
        drawWidth: 460, //文字显示的宽度
        color: "#000000", //文字的颜色
        backgroundColor: "#ffffff" //背景颜色
      };

      //将传入的配置覆盖掉默认配置
      if (!!options && typeof options === "object") {
        for (var i in options) {
          settings[i] = options[i];
        }
      }

      //获取2d的上线文开始设置相关属性
      var canvas = settings.canvas;
      canvas.width = settings.canvasWidth;
      var ctx = canvas.getContext("2d");

      //绘制背景色
      ctx.fillStyle = settings.backgroundColor;
      ctx.fillRect(0, 0, canvas.width, canvas.height);

      //绘制文字
      ctx.font = settings.font;
      ctx.fillStyle = settings.color;
      var lineWidth = 0; //当前行的绘制的宽度
      var lastTextIndex = 0; //已经绘制上canvas最后的一个字符的下标
      //由于改变canvas 的高度会导致绘制的纹理被清空，所以，不预先绘制，先放入到一个数组当中
      var arr = [];
      for (var i = 0; i < settings.text.length; i++) {
        //获取当前的截取的字符串的宽度
        lineWidth = ctx.measureText(
          settings.text.substr(lastTextIndex, i - lastTextIndex)
        ).width;

        if (lineWidth > settings.drawWidth) {
          //判断最后一位是否是标点符号
          if (judgePunctuationMarks(settings.text[i - 1])) {
            arr.push(settings.text.substr(lastTextIndex, i - lastTextIndex));
            lastTextIndex = i;
          } else {
            arr.push(
              settings.text.substr(lastTextIndex, i - lastTextIndex - 1)
            );
            lastTextIndex = i - 1;
          }
        }
        //将最后多余的一部分添加到数组
        if (i === settings.text.length - 1) {
          arr.push(settings.text.substr(lastTextIndex, i - lastTextIndex + 1));
        }
      }

      //根据arr的长度设置canvas的高度
      canvas.height = arr.length * settings.lineHeight + settings.drawStartY;

      ctx.font = settings.font;
      ctx.fillStyle = settings.color;
      for (var i = 0; i < arr.length; i++) {
        ctx.fillText(
          arr[i],
          settings.drawStartX,
          settings.drawStartY + i * settings.lineHeight
        );
      }
      //判断是否是需要避开的标签符号
      function judgePunctuationMarks(value) {
        var arr = [
          ".",
          ",",
          ";",
          "?",
          "!",
          ":",
          '"',
          "，",
          "。",
          "？",
          "！",
          "；",
          "：",
          "、"
        ];
        for (var i = 0; i < arr.length; i++) {
          if (value === arr[i]) {
            return true;
          }
        }
        return false;
      }
      return canvas.toDataURL();
    },
    goLogin() {
      this.$router.push({
        path: "/"
      });
    },
    goHome() {
      let path = "/user/myApply/patent";
      if (this.getSumbitType) {
        path = "/admin/order/pendingDisposal";
      }
      this.$router.push({
        path: path
      });
    },
    proceed() {
      this.$router.go(0);
    },
    getAllPatent() {
      this.$axios.get("api/order/patent").then(res => {
        if (res.data.code == 200) {
          let arr = [];
          let arrItem = {};
          for (let i = 0; i < res.data.data.length; i++) {
            //element的模糊匹配组件el-autocomplete指定：必须数组的每个元素是个对象，并且有value属性
            let arrItem = {};
            arrItem.value = res.data.data[i];
            arr.push(arrItem);
          }
          this.restaurants = arr;
        }
      });
      // .catch(err => {
      // 	this.$message({
      // 		type: "err",
      // 		message: err
      // 	});
      // });
    },
    querySearch1(queryString, cb) {
      let that = this;
      let restaurants = this.restaurants;
      let results = [];
      if (restaurants.length > 0) {
        results = queryString
          ? restaurants.filter(that.createFilter(queryString))
          : restaurants;
      }
      if (results.length > 0) {
        this.isSelectShow = false;
      } else {
        this.isSelectShow = true;
      }
      cb(results);
    },
    // //匹配
    // createFilter(queryString) {
    // 	return restaurants => {
    // 		//===0代表从首个字符处匹配必须成功，>=0代表从任意字符处匹配必须成功
    // 		return (restaurants.value.toLowerCase().indexOf(queryString.toLowerCase()) >= 0);
    // 	};
    // },
    handleSelect1(item) {
      // this.formProcess.id = item.id
      // this.$refs['conditionForm'].clearValidate();
    },
    // 验证专利权人 是否为个人
    valueChange(e) {
      const TEST_PATENT_USER = /协和+/;
      if (
        e.target.value.length <= 4 &&
        !TEST_PATENT_USER.test(e.target.value) &&
        this.patentUserPrompt === true &&
        this.isSelectShow
      ) {
        // 如专利权人为个人需享受相应比例的专利官费减缴，
        // 请提供上一年度年收入低于6万元的收入证明以及个人身份证明文件，
        // 我们会为您办理专利费用减缴业务。如有任何疑问请联系：严情，联系电话：13164620214
        this.$alert(
          `<p class='messgePhone'>
						&emsp;&emsp;尊敬的用户，系统检测到您填写的订单专利权人信息可能为个人，如专利权人为个人需享受相应比例的专利官费减缴，
						请提供<i class="i1">上一年度年收入低于6万元的收入证明以及个人身份证明文件</i>，订单生成后，请将纸质证明文件递交到您的专属顾问，
						我们会为您办理专利费用减缴业务。如有任何疑问请联系：<i class="i1">严情</i>，联系电话：<i class="i1">13164620214</i>。</p>`,
          "温馨提示",
          {
            confirmButtonText: "确定",
            center: true,
            dangerouslyUseHTMLString: true,
            callback: action => {
              this.patentUserPrompt = false;
            }
          }
        );
      }
      this.patentUserPrompt = false;
    },
    changePhone(e) {
      let userData = JSON.stringify(this.$store.state.user);
      if (userData === "{}") {
      } else {
        if (e.target.value != this.$store.state.user.phone) {
          if (this.ifChangePhone) {
            this.$alert(
              `<p class='messgePhone'>
								&emsp;&emsp;请确认是否更改联络人及联系人电话信息？系统登录账户为<span class="finish">联络人手机号码</span>，如需更改，请使用修改后的账户登录系统查询此订单信息</p>`,
              "温馨提示",
              {
                confirmButtonText: "确定",
                center: true,
                dangerouslyUseHTMLString: true,
                callback: action => {
                  this.ifChangePhone = false;
                }
              }
            );
          }
        }
      }
    }
  },

  watch: {
    option1(val, oldVal) {
      if (val[1] == "a") {
        this.isHiddenTextarea = false;
      } else {
        this.isHiddenTextarea = true;
      }
    },
    option3(val, oldVal) {
      if (val == "Y") {
        this.isHiddenDrop = false;
      } else {
        this.isHiddenDrop = true;
      }
    }
  }
};
</script>

<style lang="less" scoped>
.tw-top {
  .el-popper {
    box-sizing: border-box;
    .el-cascader-menu:last-child {
      height: 185px;
      padding-top: 34px;
      box-sizing: border-box;
    }
  }
}

.td-top {
  .el-popper {
    box-sizing: border-box;
    .el-cascader-menu:last-child {
      height: 185px;
      box-sizing: border-box;
      padding-top: 103px;
    }
  }
}
// 	@media (min-width: 750px) {
// 		#order-root>.order {
// 			width: 60% !important;
// 			font-size: 20px;
// 		}
// 	}
//
// 	@media (max-width: 750px) {
// 		#order-root {
// 			font-size: 35px;
// 			padding-top: 0px !important;
// 		}
//
// 		.subscriptio {
// 			display: none; //隐藏公众号的二维码图片
// 		}
// 	}

#order-root {
  ul {
    list-style: none;
  }
  .clearfix:after {
    content: "";
    height: 0;
    display: block;
    clear: both;
  }
  .clearfix {
    zoom: 1;
  }
  .required-tag {
    color: #d9534f;
  }

  width: 100%;
  padding-top: 20px;
  background-color: rgb(237, 241, 246);

  .subscriptio {
    z-index: 100;
    position: fixed;
    right: 195px;
    top: 19px;
    width: 180px;
    height: 180px;
    display: none;
  }

  .order {
    padding: 20px;
    background-color: white;
    margin-left: auto;
    margin-right: auto;
    font-size: 15px;
    width: 70%;

    // width: 100%;
    .logo-box {
      background: gainsboro;
      margin-left: auto;
      margin-right: auto;

      .logo-img {
        height: 150px;
      }
    }

    .order-title {
      color: rgb(31, 116, 199);
      font-weight: bold;
      font-style: normal;
      margin: 50px 0 0 0;
      line-height: 60px;
    }

    .hr {
      margin-top: 10px;
      border: 1px solid #c5cfdb;
      /*no*/
    }

    .center-title {
      // color: rgb(240, 173, 78);

      // font-weight: bold;
      // font-size: 25px;
    }

    .center-title2 {
      color: rgb(23, 140, 223);

      font-weight: bold;
    }

    .h4 {
      color: #3d464d;
      font-weight: bold;
      margin-top: 20px;
      margin-bottom: 10px;
      // font-size: 30px;
    }

    .patentInfo_select {
      // margin-bottom: 10px;
    }
    .input-left {
      padding: 0 20px 0 0;
      display: block;
      box-sizing: border-box;
      width: 50%;
      float: left;
    }
    .Explanation-top {
      font-size: 13px;
      display: block;
      margin-bottom: 8px;
      padding-left: 5px;
    }
    .Explanation-right {
      padding: 0 0 0 20px;
      box-sizing: border-box;
      display: block;
      width: 50%;
      float: left;
      padding-inline-start: 0;
      font-size: 13px;
      min-height: 40px;
      // margin-left: 20px;
    }

    .span1 {
      color: rgb(217, 83, 79);
      font-weight: bold;
    }

    .span2 {
      // color: rgb(23, 140, 223);
      color: rgb(62, 209, 172);
      font-weight: bold;
    }

    .span4 {
      color: rgb(88, 88, 88);
    }

    .b {
      color: #3d464d;
    }

    .field {
      // margin-top: 10px;

      .el-input__inner {
        // max-width: 400px;
        height: 40px !important;
        /*no*/
      }
    }

    .upload-demo {
      // margin-top: 10px;
    }

    .submit-btn {
      margin-top: 60px;
    }

    .tableTitle {
      position: relative;
      margin: 30px auto;
      // width: 600px;
      height: 2px;
      background-color: #d4d4d4;
      text-align: center;
      font-size: 16px;
      color: rgba(101, 101, 101, 1);
    }

    .midText {
      position: absolute;
      left: 50%;
      background-color: #ffffff;
      padding: 10px 15px;
      transform: translateX(-50%) translateY(-50%);
    }
    .center {
      position: relative;
      .centerLine {
        position: absolute;
        height: 100%;
        top: 0;
        width: 1px;
        // background:rgb(172, 172, 172);
        border-right: 1px dashed rgb(172, 172, 172);
        // margin-left: -1px;
        left: 50%;
        // z-index: 1;
      }
    }

    .linehighlight40 {
      line-height: 40px;
    }
    .confirmText {
      font-size: 15px;
    }
    .el-message-box__header {
      .el-message-box__title {
        color: #67c23a;
      }
    }
  }
}
.copyright-information {
  text-align: center;
  line-height: 40px;
}
.i1 {
  font-style: normal;
  color: rgb(62, 209, 172);
}
.file_sh {
  font-size: 25px;
  margin-right: 10px;
}
.messgePhone {
  text-align: left;
}
.el-button--small{
  padding: 12px 20px;
  font-size: 14px;
  border-radius: 4px;
}
</style>
